<template>
	<view class="container">
		<text class="detail" @tap="godetail">贝壳明细</text>
		<view class="nowShallBox">
			<view class="item withdrawYes">
				<view class="icon">
					<image src="../../static/images/public/shellIcon.png" mode=""></image>
					<text>{{data.count}}</text>
				</view>
				<text class="label">当前拥有</text>
			</view>
		</view>
		<button class="btn withdraw" type="default" @tap="goWithdraw">提现</button>
		<button class="btn exchange" type="default" @tap="goChange">转为个人黑贝壳</button>
		<view class="bottom__explan" @tap="navTo('/pages/center/help/rulesDetail?type=1')">
			<text class="cell-more yticon icon-zuo"></text>
			黑贝壳说明
			<text class="cell-more yticon icon-you"></text>
		</view>
	</view>
</template>

<script>
	import {
		getsellershellcount
	} from '@/api/merchant.js'
	export default {
		data() {
			return {
				data: {},
				phone: '',
				is_checked: '',
				is_bind_bank: '',
				withdraw_pass: '',
			}
		},
		onShow() {
			getsellershellcount().then(res => {
				this.data = res.data.list[0]
			})
			this.phone = uni.getStorageSync("userInfo").phone
			this.is_checked = uni.getStorageSync("userInfo").is_checked
			this.is_bind_bank = uni.getStorageSync("userInfo").is_bind_bank
			this.withdraw_pass = uni.getStorageSync("userInfo").withdraw_pass
		},
		methods: {
			godetail() {
				uni.navigateTo({
					url: "./detail?id=1&name=黑贝壳"
				})
			},
			goWithdraw() {
				if(this.status != 1 && !this.data.count){
					uni.showToast({
						title: "没有可提现贝壳",
						icon: "none",
						duration: 1500
					});
					return
				}
				
				if (!this.withdraw_pass) {
					uni.showModal({
						content:"提现需设置操作密码",
						confirmText:"去设置",
						cancelText:"取消",
						confirmColor: "#57BE6A",
						success: function(res) {
							if(res.confirm){
								uni.navigateTo({
									url: "/pages/center/accountSet/payPassword/payPassword?backurl=true"
								})
							}
						}
					})
					return
				}
				uni.navigateTo({
					url: "./withdrawal?id=1&name=黑贝壳"
				})
			},
			goChange() {
				uni.navigateTo({
					url: `./exchangeShell`
				})
			},
			navTo(url){
				uni.navigateTo({
					url: url
				})
			}

		}
	}
</script>

<style lang="scss" scoped>
	.container {
		position: relative;
		text-align: center;
		padding-top: 40%;

		.detail {
			position: absolute;
			right: 30rpx;
			top: 20rpx;
			width: 140rpx;
			height: 62rpx;
			line-height: 62rpx;
			text-align: center;
			font-size: 24rpx;
			font-weight: bold;
			color: rgba(255, 255, 255, 1);
			background: $theme-color;
			border-radius: 31rpx;
		}
		
		.nowShallBox {
			display: flex;
			justify-content: center;
			.item{
				width: 50%;
				.icon {
					display: flex;
					justify-content: center;
					align-items: center;
				
					image {
						width: 60rpx;
						height: 40rpx;
						margin-right: 10rpx;
					}
				
					text {
						font-size: 50rpx;
						font-weight: bold;
						color: rgba(51, 51, 51, 1);
					}
				}
				.label {
					margin-top: 20rpx;
					font-size: 26rpx;
					font-weight: 400;
					color: rgba(51, 51, 51, 1);
				}
			}	
		}
		.btn{
			position: fixed;
			left: 75rpx;
			width:600rpx;
			height:80rpx;
			line-height: 80rpx;
			font-size:32rpx;
			font-weight:bold;
			color:rgba(255,255,255,1);
			background:$theme-color;
			border-radius:40rpx;
		}
		.withdraw{
			bottom: 380rpx;
		}
		.exchange{
			bottom: 240rpx;
		}
	}
</style>
